<template>
    <div style="padding-top: 53px;">
        <tabbar>
            <tabbar-item :link="item.link" v-for="item in list" :show-dot="item.show_dot" :selected="item.selected"
                         :badge="item.badge">
                <i slot="icon" class="icon iconfont" :class="item.icon"></i>
                <span slot="label">{{item.title}}</span>
            </tabbar-item>
        </tabbar>

    </div>
</template>

<script>
    import {Tabbar, TabbarItem, Cell} from 'vux'

    export default {
        components: {
            Tabbar,
            TabbarItem,
            Cell,
        },
        methods: {
            menu() {

                this.list = [
                    {
                        title: '首页',
                        icon: 'icon-31shouye',
                        link: '/index',
                        // badge:'0',
                        show_dot: false,
                        selected:false
                    }
                    , {
                        title: '收藏',
                        icon: 'icon-zan',
                        link: '/collect',
                        // badge:"0",
                        show_dot: false,
                        selected:false
                    }
                    , {
                        title: '消息',
                        icon: 'icon-31xiaoxi',
                        link: '/message',
                        // badge:'aa',
                        show_dot: false,
                        selected:false
                    }
                    , {
                        title: '我的',
                        icon: 'icon-31wode',
                        link: '/user',
                        // badge:"0",
                        show_dot: false,
                        selected:false
                    }
                ];

                var path = this.$route.path;
                //
                var _this=this;
                setTimeout(function () {
                    for(var i=0;i<_this.list.length;i++){

                        if(path==_this.list[i].link){
                            _this.list[i].selected=true;
                        }

                    }
                },100);



            }
        },
        data() {
            return {
                list: [],

            }
        },
        created() {
            this.menu();
        },
        activated() {
            this.menu();
        }
    }
</script>
<style type="text/css">
    @import "../assets/css/base.css";
    @import "../../static/iconfont/iconfont.css";
</style>
<style type="text/css" scoped>

</style>